
<template>
  <div class="Page_CommentStyleBox">
    <div class="Page_CommentStyleLeftBox">
      <PageHomeFromRouer></PageHomeFromRouer>
    </div>
    <div class="Page_CommentStyleRightBox">
      <div class="Page_CommentStyleHeadTitleBox">
        <PageHeadRigthFrom></PageHeadRigthFrom>
      </div>
      <div class="Page_CommentStyleHeadTitleDeaBt">
        <a-breadcrumb class="Page_CommentStyleHeadLink">
          <a-breadcrumb-item><a href="/home">工作台</a></a-breadcrumb-item>
          <a-breadcrumb-item><a href="">评论管理</a></a-breadcrumb-item>
        </a-breadcrumb>
      </div>

      <div class="Page_CommentStyleFromInputBox">
        <div class="Page_CoNteNXT">
          <p>
            称呼：<input
              class="InputNameBix"
              type="text"
              placeholder="请输入称呼"
            />
          </p>
          <P class="EmailStyleBOXs">
            Email：<EmailInputStyleBox></EmailInputStyleBox
          ></P>
          <p class="EmailStyleBox">
            <span>状态：</span>&nbsp;<EmailIputBox></EmailIputBox>
          </p>
          <p class="CommentButton">
            <a-button type="primary">搜索</a-button>
            <a-button>重置</a-button>
          </p>
        </div>
        <div class="Page_CommentFromList">
          <CommentFromList></CommentFromList>
        </div>
        <dl style="textAlign: center; marginTop: 20px">
          <dt>
            <a href="https://github.com/fantasticit/wipi"
              ><img src="../../assets/b.png.png" alt=""
            /></a>
          </dt>
          <dd>Copyright ® 2022 Designed by Fantasticit.</dd>
        </dl>
      </div>
    </div>
  </div>
</template>


<script>
import CommentFromList from "../../components/CommentFromList/index.vue";
import EmailInputStyleBox from "../../components/EmailInputStyleBox/index.vue";
import EmailIputBox from "../../components/EmailIputBox/index.vue";
import PageHeadRigthFrom from "../../components/PageHeadRigthFrom";
import PageHomeFromRouer from "../../components/PageHomeFromRouer";
export default {
  data() {
    return {};
  },
  created() {},
  methods: {},
  components: {
    PageHomeFromRouer,
    PageHeadRigthFrom,
    EmailIputBox,
    EmailInputStyleBox,
    CommentFromList,
  },
};
</script>

<style>
.Page_CommentStyleBox {
  width: 100%;
  height: 100%;
  display: flex;
}
.Page_CommentStyleLeftBox {
  width: 13%;
  height: 100%;
  overflow: hidden;
  overflow-y: auto;
  background: #001529;
  border-right: 1px solid #ccc;
}
.Page_CommentStyleRightBox {
  width: 100%;
  height: 100%;
  overflow-y: auto;
}
.Page_CommentStyleHeadTitleBox {
  width: 100%;
  height: 45px;
  border-bottom: 1px solid #ccc;
}
.Page_CommentStyleHeadTitleDeaBt {
  width: 100%;
  height: 45px;
  border-bottom: 1px solid #ccc;
}
.Page_CommentStyleHeadLink {
  display: inline-block;
  margin-left: 30px;
  margin-top: 10px;
}
.Page_CommentStyleFromInputBox {
  width: 100%;
  height: 100%;
  overflow-y: auto;
  overflow: hidden;
  background: #eff2f5;
}
.Page_CoNteNXT {
  width: 96%;
  height: 150px;
  margin-left: 30px;
  margin-top: 30px;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: space-around;
}
.Page_CommentFromList {
  width: 96%;
  height: auto;
  margin-left: 30px;
  margin-top: 30px;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: space-around;
}
.EmailStyleBox {
  display: flex;
  align-items: center;
}
.EmailStyleBOXs {
  display: flex;
  align-items: center;
}
.InputNameBix {
  padding: 0px 10px;
}
.CommentButton {
  margin-top: 50px;
}
</style>
